<template>
	<view class="item flex flexC bgff mx15 mb12 shadow px10 py12 r10">
		<image class="r10 cover" :src="item.logo" mode="aspectFill"></image>
		<view class="flex1 pl8 flexCol flex flexB rightBox">
			<view class="">
				<view class="flex flexC w-20">
					<text class="c33 fs16 bold6">{{item.name}}</text>
					<text class="c33 fs11 r3 bgfad px7 py1 ml7">{{item.level}}</text>
					<view class="flex1 aliR fs13">{{item.distance}}</view>
				</view>
				<view class="fs12 py8">{{item.tag}}</view>
				<view class="tags fs11">
					<text class="r4 bor mr8 px4 py1" v-for="t in item.type">{{t}}</text>
				</view>
			</view>
			<view class="flex flexC c33 w-20">
				<text class="fs16 bold6">￥{{item.price}}</text>
				<text class="fs12 flex1">/小时</text>
				<text class="r40 fs14 bgfad px14 py4 bold6" @click="book(item)">预约</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			item: {
				type: Object,
				default: {}
			},
			lat: {
				type: [Number, String],
				default: ''
			},
			lng: {
				type: [Number, String],
				default: ''
			}
		},
		methods: {
			book(item){
				uni.navigateTo({
					url:'../assistant/submit?id='+item.id+"&lat="+this.lat+"&lng="+this.lng
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.item {
		.rightBox {
			height: 210rpx;
		}
		.cover {
			width: 210rpx;
			height: 210rpx;
		}
		.bgfad {
			background-color: #FAD00D;
		}
	}
</style>